<template>
  <div>
<!-- 
    <div class="duet">
<van-button @click="" round size="mini" type="default">全部</van-button>
<van-button  round size="mini" type="default">测试</van-button>
<van-button  round size="mini" type="default">前端</van-button>
<van-button  round size="mini" type="default">产品</van-button>
<van-button  round size="mini" type="default">设计</van-button>
<van-button  round size="mini" type="default">架构</van-button>
    </div> -->

    <div>
    <van-nav-bar
  title="在招职位"
 
  left-arrow
  @click-left="onClickLeft"
  
/>
</div>
<div>
  <van-dropdown-menu >
   <van-dropdown-item @change="changesd" v-model="value1" :options="option1" />
 <van-dropdown-item @change="changesd"  v-model="value2" :options="option2" />
 <van-dropdown-item @change="changesd"  v-model="value3" :options="option3" />
</van-dropdown-menu>
</div>



<div  class="bacss" v-for="(item, index) in datas" :key="index"  @click="$router.push(`/positiondetails/${item.id}`)"  >
  <div>
    <div class="text">{{item.name}}</div>
    <span>{{item.city}}</span>
    <span>{{item.experience}}</span>
    <span>{{item.education}}</span>
  </div>
  <div class="xzhi">{{item.salary}}</div>
</div>

  </div>
</template>

<script>
import {positionsAPI} from '@/api/company'
// import router from '@/router';
export default {
name:'RecruitMent',
 data() {
 
    return {
      //数据
      datas:[],
      //控制数据的类型
       datalist:{
        id: '',
        limit:999

     },
      value1: '全部',
      value2: '全部',
      value3:'全部',
      option1: [
        { text: '城市全部', value: '全部' },
        { text: '北京', value: '北京' },
        { text: '杭州', value: '杭州' },
      ],
      option2: [
        { text: '经验全部', value: '全部' },
        { text: '1-3年', value: '1-3年' },
        { text: '3-5年', value: '3-5年' },
        { text: '5-10年', value: '5-10年' },
      ],
       option3: [
        { text: '待遇全部', value: '全部' },
        { text: '10-20k', value: '10-20k' },
        { text: '15-25k', value: '15-20k' },
      ],
    };
  },
  created(){
this.lopgdata()
  },
methods:{
  changesd(value){
    if(value=='全部'){
   delete   this.datalist.city
    }else {
      this.datalist.city=value
    }

this.lopgdata()
// delete  this.datalist.city
  },
  //返回事件
      onClickLeft() {
      this.$router.back()
    },
   async lopgdata(){
    this.datalist.id= this.$route.params.id
 const res= await  positionsAPI(this.datalist)
 console.log(res);
 this.datas=res.data.list
    }
}
}
</script>

<style lang="less" scoped>
.duet{
  margin-bottom: 10px;
}
  ::v-deep .van-nav-bar__text{
  color: #4d4d4d;
}
.bacss{
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
  height: 80px;
  .xzhi{
    color: #e40137;
    width: 80px;
  }
  .text{
    margin-bottom: 10px;

    font-size: 20px;
    font-weight: 700;

  }
  span{
        background: #f7f4f5;
        margin-right: 6px;
    color: #b4b4bd;
  }
}
</style>